<template>
  <form-dialog
    :title="isBatch === false ? title:title2"
    :visible="visible"
    @handleClose="handleClose"
    width='30%'
  >
    <template #footer>
      <el-button @click="handleClose">{{ $t('common.cancel') }}</el-button>
      <el-button type="primary" @click="submit" :loading="loading">{{ $t('common.confirm') }}</el-button>
    </template>
  </form-dialog>
</template>
<script lang="ts">
import Vue from 'vue';
import FormDialog from '@/components/Dialog/confirmDialog.vue';
export default Vue.extend({
  components: { FormDialog },
  props: {
    deleteMethod: {
      type: Function,
      default() {
        return () => Promise.resolve();
      }
    }
  },
  data() {
    return {
      visible: false,
      loading: false,
      title: "",
      title2:"",
      tip: "",
      message: "",
      md_id: '',
      isBatch: false,
      formData: ''
    }
  },
  methods: {
    init(row: any, isBatch: any) {
      // console.log(row)
      this.title = (this as any).$t('clientVersionLog.deleteVersionLog')
      this.title2 = (this as any).$t('clientVersionLog.deleteVersionTip')
      this.md_id = row.id
      this.visible = true;
      this.isBatch = isBatch;
      this.formData = JSON.parse(JSON.stringify(row));
    },
    handleClose() {
      (this as any).visible = false;
      (this as any).loading = false;
    },
    submit() {
      (this as any).loading = true;
      let lists = [];
      if(this.isBatch) {
        for(let i in (this as any).formData){
          lists.push((this as any).formData[i].id);
        }
      }else {
        lists.push((this as any).formData.id);
      }
      // console.log(lists);
      (this as any).deleteMethod({"version_instruction_ids": lists}).then(() => {
        (this as any).visible = false;
      }).finally(() => {
        (this as any).loading = false;
      });
    }
  }
})
</script>
<style lang="scss" scoped>
  .tip-container {
    .icon {
      width: 80px;
      padding-right: 20px;
      display: inline-block;
      text-align: right;
      &::before {
        font-size: 20px;
        color:#fe983d;
      }
    }

    .text {
      color: #333333;
      font-size: 16px;
    }
  }
  .message-container {
    color: #999999;
    font-size: 12px;
    padding-left: 80px;
    margin: 10px 0px;
  }
</style>